<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>忘忧网后台</title>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link rel="stylesheet" href="Xadmin/css/xadmin.css">
    <link rel="stylesheet" href="Xadmin/css/login.css">
    <link rel="stylesheet" href="Xadmin/css/font.css">
    <script type="text/javascript" src="Xadmin/js/xadmin.js"></script>
    <script src="./layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script src="layui/layui.js" charset="utf-8"></script>
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body class="login-bg" style="background-image: url('image/zhuce1.png') ">

<div class="login">
    <div class="message">忘忧网后台登录</div>
    <form method="post" style="margin-top: 2rem">
        <input placeholder="请输入邮箱地址" type="email" class="layui-input" id="address">
        <hr class="hr15">
        <div>
            <input style="float: left;width: 10rem;" placeholder="验证码" type="text" class="layui-input" id="yzm">
            <input value="获取验证码" style="width: 11rem;float:left;" type="button" id="loginBtn" onclick="sendCode()">
        </div>
        <hr class="hr15">
        <input value="邮箱登录" style="width: 100%" type="button"  onclick="IsCode()">
        <hr class="hr20">
        <input value="返回" style="width: 100%" type="button"  onclick="back()">
        <hr class="hr20">
    </form>
    <p>如遇邮件发送失败，请等待60S后重试，[忘忧网]</p>
</div>
</body>
<script>
    var layer
    var time = 60
    layui.use('layer',function () { //导入组件
        layer=layui.layer
    })
    function sendCode(){//发送邮箱验证码
        var myreg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
        if(!myreg.test($("#address").val())){//邮箱地址错误
            layer.alert("邮箱地址错误！")
        }else {
            var load =layer.load(1,{shade:[0.1,'#fff']}); //转圈等待
            $.ajax({
                url:"http://127.0.0.1:8082/User/SendCode",
                type:"get",
                data:{
                    EmailAddress:$("#address").val()
                },
                success:function (res){
                    layer.close(load);//关闭转圈等待
                    var obj = JSON.parse(res) //转成JSON对象
                    if(obj.code==0){
                        layer.alert("邮件发送成功！")
                        djs()//开始倒计时
                    }else{
                        layer.alert(obj.msg)
                    }
                    console.log(obj)
                }
            })
        }
    }

    function IsCode() {//校验验证码
        var loadix = layer.load(1, {shade: [0.1,'#fff']});
        $.ajax({
            url: "http://127.0.0.1:8082/User/SendCode",
            type: 'post',
            data: {
                EmailAddress: $("#address").val(),
                Code: $("#yzm").val()
            },
            success: function (result) {
                layer.close(loadix);
                console.log(result);
                var obj = JSON.parse(result);//将JSON字符串转换为JSON对象
                if(obj.code===0){
                    window.location.href="Index2.html"
                }else{
                    layer.alert(obj.msg)
                }
                console.log(obj.code)
            },
            error: function (e) {
                console.log(e.status);
                console.log(e.responseText);
            }
        })

    }
    //倒计时
    function djs(){
        $("#loginBtn").attr('disabled',true);
        if(time===1){
            $('#loginBtn').val("获取验证码")
            $("#loginBtn").attr('disabled',false);
            time=60
            return;
        }else{
            time--;
            $("#loginBtn").val(time+"秒后重发！")
        }
        setTimeout(function () {
            djs();
        },1000)
    }

    function back(){
        window.location.href="LoginForPwd.html"
    }
</script>
</html>